<!DOCTYPE html>
<html>

	<head>
		<!-- 声明文档使用的字符编码 -->
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<!-- 为移动设备添加 viewport -->
		<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
		<!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
		<meta name="HandheldFriendly" content="true">
		<!-- 优先使用 IE 最新版本和 Chrome -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

		<title>黑图视界</title>
		<meta name="keywords" content="黑图视界">
		<meta name="description" content="黑图视界">
		<script type="text/javascript" src="../js/setFontSize.js"></script>
		<link rel="stylesheet" href="../css/swiper.min.css" />
		<link rel="stylesheet" href="../css/main.css" />
		<link rel="shortcut icon" href="../img/personIcon2.jpg">
	</head>
	<style>
		#div1{
			border:2px solid #1e9fff;
		}
	</style>

	<body>
		<main class="pab120">
			<div id="app">
				<section class="yudingDeItem picBgPinkW mbt30">
					<div class="container">
						<div class="picBox">
							<img :src="activity.src" class="pic radius20" id="imgs"/>
						</div>
						<h3 class="commonTitle clearfix"><i class="icon"></i>{{activity.activityname}}<span class="price">￥{{activity.price}}</span></h3>
						<div class="commontext">
							{{activity.ad}}
						</div>
					</div>
				</section>
				<section class="yudingDeItem whiteBg mbt30">
					<div class="container">
						<h3 class="commonTitle"><i class="icon"></i>活动介绍</h3>
						<div class="commontext">
							{{activity.introduce}}
						</div>
					</div>
				</section>
				<section class="yudingDeItem whiteBg">
					<div class="container">
						<h3 class="commonTitle"><i class="icon"></i>温馨提示</h3>
						<div class="commontext">
							{{activity.warning}}
						</div>
					</div>
				</section>
				<section class="profileItem whiteBg">
					<div class="container">
						<h3 class="commonTitle"><i class="icon"></i>用户评论</h3>
						<div class="commontext" v-for="content in contents" id="div1">
							<div>评论者：{{content.user.realname}}  评论时间：{{content.createtime}}</div>
							<div>评论内容：{{content.msg}}</div>
							<div>点赞数：{{content.likenum}}</div>
							<img src="../img/like.jpg" width="30px" height="30px" @click="like(content)" v-show="!content.islike" >
							<img src="../img/nolike.jpg" width="30px" height="30px"  @click="deletelike(content)" v-show="content.islike" >
							<div v-show="loginUser.id==content.userid">
								<button @click="updateContent(content.id)">修改</button>
								<button @click="deleteContent(content.id)">删除</button>
							</div>
						</div>
					</div>
					发布评论:<input type="text" class="formInput" v-model="activityContent.msg" style="width: 100%;height: 100px" placeholder="可发布关于该场馆的评论，用户需要登录后才能发布评论。"/>
					<button type="button" class="subBtn" @click="send()">发布</button>
				</section>
				<div class="asideBox">
					<div class="container">
						<a class="asideBtn" @click="goToForm(activity.id)">立即预定</a>
					</div>
				</div>
			</div>
		</main>
		<script type="text/javascript" src="../js/jquery-3.3.1.min.js"></script>
		<script type="text/javascript" src="../js/swiper.min.js"></script>
		<script type="text/javascript" src="../js/layer/layer.js" ></script>
		<script type="text/javascript" src="../js/Mdate.js"></script>
		<script type="text/javascript" src="../js/iScroll.js"></script>
		<script type="text/javascript" src="../js/main.js"></script>
		<script src="../js/axios.js"></script>
		<script src="../js/vue.js"></script>
		<script src="../js/getParameter.js"></script>
	<script>
		let app1=new Vue({
			el:"#app",
			data:{
				loginUser:{},
				activity:{
				},
				contents:{},
				likecontents:{},
				activityContent:{
					msg:"",
					activityid:getParameter("id")
				}
			},
			methods:{
				goToForm(id){
					location.href="yudingForm.html?id="+id;
				},
				findLogin(){
					let _this=this;
					axios.get("/user/findLogin/").then(function (response){
						_this.loginUser=response.data;
					})
				},
				loadActivityList(){
					let _this=this;
					axios.get("/content/loadActivityList",{params: {id:getParameter("id")}}).then(function (response){
						_this.contents=response.data;
						console.log(_this.contents)
					})
				},
				send(){
					let _this=this;
					axios.post("/content/sendA",_this.activityContent).then(function (response){
						location.href="/userclient/yudingDe.html?id="+getParameter("id");
					})
				},
				like(content){
					let _this=this;
					axios.get("/user/findLogin/").then(function (response){
						if(response.data===""){
							location.href="/userclient/login.html";
						}else {
							axios.get("/content/addAClike",{params:{cid:content.id}}).then(function (response){
								content.islike=true;
								content.likenum++;
								// location.href="/userclient/yudingDe.html?id="+getParameter("id");
							})
						}
					})
				},
				deletelike(content){
					let _this=this;
					axios.get("/content/deleteAClike",{params:{cid:content.id}}).then(function (response){
						content.islike=false;
						content.likenum--;
						// location.href="/userclient/yudingDe.html?id="+getParameter("id");
					})
				},
				frashlike(){
					let _this=this;
					axios.get("/content/findlike").then(function (response){
						if(response.data!==""){
							_this.likecontents=response.data;
							for(let i=0;i<_this.likecontents.length;i++){
								for(let j=0;j<_this.contents.length;j++){
									if(_this.likecontents[i].contentid===_this.contents[j].id){
										_this.contents[j].islike=true;
									}
								}
							}
						}
					})
				},
				updateContent(id){
					let _this=this;
					location.href="/userclient/updateContent.html?cid="+id+"&aid="+getParameter("id");
				},
				deleteContent(id){
					let _this=this;
					axios.delete("/content/deleteACContent",{params:{cid:id}}).then(function (response){
						location.href="/userclient/yudingDe.html?id="+getParameter("id");
					})
				},
			},
			created(){
				let id= getParameter("id");
				const _this=this;
				console.log(_this.activity);
				axios.get("/activity/queryById",
						{params:{id:id}})
						.then(function (response) {
							_this.activity=response.data;
						});
				_this.loadActivityList();
				_this.frashlike();
				_this.findLogin();
			}

		})
	</script>
	</body>

</html>